﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
    <style>
        .i-full-screen
        {
            width: 100%;
            height: 100%;
            border: none;
            display: inline;
        }
        .root
        {
            height: 100%;
            max-height: 100%;
            overflow: hidden;
            border: 0;
            padding: 0;
            margin: 0;
        }
    </style>
    <script src="js/lib/jquery-1.6.1.min.js"></script>
    <script src="js/lib/jquery.ba-postmessage.js"></script>
    <script src="js/lib/jquery.iframe.js"></script>
    <script src="js/ezdesk/iindexservice.js"></script>
    <script>

        var indexService;

        var serviceLocation = {
            serviceBaseUrl: "",
            modulePaths: { LoginModulePath: "login.html",
                NotificationModulePath: "notification.html",
                MiniMainModulePath: "minimain.html",
                MainModulePath: "main.html",
                FunctionModulePath: "functionpagehost.html"
            },
            config: function (serviceBaseUrl) {
                this.serviceBaseUrl = serviceBaseUrl;
                for (var q in this.modulePaths) {
                    this[q] = serviceBaseUrl + this.modulePaths[q];
                }
            }
        };


        var application = {
            currentState: 'begin',
            min: function () {
                $('#i-login').hide();
                $("#i-mini-main").show();
                $("#i-main").hide();
                indexService.setTopMost(true);
            },
            normal: function () {
                $('#i-login').hide();
                $("#i-mini-main").hide();
                $("#i-main").show();
                indexService.setTopMost(false);
            },
            start: function () {
                $('#i-login').show();
                $('#i-main').hide();
                $('#i-mini-main').hide();
                $('#div-notification').hide();
                console.log('sign out');

                application.currentState = 'begin';
            },
            onLogin: function (result) {
                if (result) {
                    mainModule.loadPage(function () {
                        notificationModule.loadPage();
                        miniMainModule.loadPage();
                        application.normal();
                    });

                }
            },
            onMessage: function (e) {
                var paramKeyRegex = /\w*(?=\:)/g;
                var key = paramKeyRegex.exec(e.data);

                key = key ? key[0] : e.data;
                if (key == 'min') {
                    application.min();
                }
                if (key == 'hide') {
                    indexService.hideCurrentWindow();
                }
                if (key == 'normal')
                    application.normal();
                if (key == 'close')
                    application.min();
                if (key == 'notification')
                    notificationModule.showNotification(e.data.substring(key.length + 1));
                if (key == 'notification-hide')
                    notificationModule.hideNotification();
                if (key == 'url') {
                    var actionUrl = serviceLocation.FunctionModulePath + "?url=" + escape(e.data.substring(key.length + 1));
                    indexService.newWindow(actionUrl);
                }
                if (key == 'signout') {
                    indexService.showCurrentWindow();
                    $.postMessage('signout', '*', window.frames['i-login']);
                    application.start();
                    mainModule.unload();
                    miniMainModule.unload();
                    notificationModule.unload();
                }
                if (key == 'login')
                    application.onLogin(e.data.substring(key.length + 1));
                if (key == 'action')
                    $.postMessage('action:' + e.data.substring(key.length + 1), '*', window.frames['i-main']);
            }
        };
        var notificationModule = {
            loadPage: function () {
                $('#i-notification').src(serviceLocation.NotificationModulePath);
            },
            unload: function () {
                $('#i-notification').src("");
            },
            showNotification: function (desireHeight) {
                var $NotificationIframe = $('#div-notification').height(parseInt(desireHeight) + 25);
                $NotificationIframe.fadeIn();
            },
            hideNotification: function () {
                var $NotificationIframe = $('#div-notification');
                $NotificationIframe.fadeOut();
            }
        };
        var loginModule = {
            loadPage: function () {
                $('#i-login').css('opacity', 0);
                $('#i-login').src(serviceLocation.LoginModulePath, function () {
                    $('#i-login').css('opacity', 1);
                });
            }

        };
        var mainModule = {
            loadPage: function (afterInit) {
                $('#i-main').css('opacity', 0);
                $('#i-main').src(serviceLocation.MainModulePath, function () {
                    $('#i-main').css('opacity', 1);
                    if (afterInit) afterInit();
                });
            },
            unload: function () {
                $('#i-main').src("");
            }
        };

        var miniMainModule = {
            loadPage: function () {
                $('#i-mini-main').src(serviceLocation.MiniMainModulePath);
            },
            unload: function () {
                $('#i-mini-main').src("");
            }
        };


        function go() {
            $('#serverPanel').css('display', 'none');
            var serverBaseUrl = $("#serverSelect").val();
            serviceLocation.config(serverBaseUrl);


            loginModule.loadPage();
            indexService.createTray();
            application.start();
        }


        //发布时应带给吧环境设为 env='real'
        //var env = 'real';
        var env = 'local';
        //var env = 'deploy';
        function serverLoad() {
            var servers = [
                  { env: 'real', url: "http://192.168.10.136:8100/app/" }
                , { env: 'deploy', url: "http://www.weimargroup.com:2500/app/" }
                , { env: 'real-inner', url: "http://192.168.10.3:20501/app/" }
                , { env: 'test', url: "http://192.168.10.6:20501/app/" }
                , { env: 'local', url: "http://localhost:20501/app/" }
                , { env: 'local1', url: "http://localhost:20555/ezdesk.servicehost/app/" }
            ];

            var optionTemplate = '<option value="{url}">{url}</option>';
            for (var i in servers) {
                var optionStr = optionTemplate
                                    .replace('{url}', servers[i].url)
                                    .replace('{url}', servers[i].url);
                var $option = $(optionStr);
                if (env == servers[i].env) $option.attr('selected', 'selected');
                $option.appendTo('#serverSelect');
            }

            if (env == 'local') {
                setTimeout(function () {
                    if ($('#serverPanel').css('display') == 'none') return;
                    go();
                }, 5000);
            }
            else
                go();

            $('#go').click(go);
        }


        $(function () {
            indexService = GetIndexService();
            serverLoad();
            $.receiveMessage(application.onMessage);
        });

    </script>
</head>
<body class="root">
    <div style="background-color: #bbb; font-weight: bold;" id="serverPanel">
        <div>
            <span>Server:</span>
            <select id="serverSelect" style="width: 500px;">
            </select>
            <input type="button" value="Go" id="go" autofocus />
        </div>
    </div>
    <iframe id="i-login" class="i-full-screen"></iframe>
    <iframe id="i-main" class="i-full-screen"></iframe>
    <iframe id="i-mini-main" class="i-full-screen"></iframe>
    <div id="div-notification" style="height: 300px; width: 500px; position: absolute;
        bottom: 0px; right: 0px; float: right;">
        <iframe id="i-notification" class="i-full-screen"></iframe>
    </div>
</html>
